<template>

  <div class="bigboss">
    <div class="tab-bar-bgc">
       <!-- <img src="../../assets/images/smallicon/底背景1.png" alt=""> -->
   </div>
   <tab-bar>   
     <tab-bar-item path="/home" activeColor="#6b0c03">
        <template v-slot:item-icon>
          <img src="https://qnhyd.laigl.com/298707e53cecb8e49879fa26b02d90b8.png" alt="">
        </template>
        <template v-slot:item-icon-active>
          <img src="https://qnhyd.laigl.com/e244798a7c8f4aff430bb1a2ba82f892.png" alt="">
        </template>
        <template v-slot:item-text>
          <div>首页</div>
        </template>
     </tab-bar-item>

     <tab-bar-item path="/community" activeColor="#6b0c03">
        <template v-slot:item-icon>
          <img src="https://qnhyd.laigl.com/d9cb57752677a7d749a07a9d6d6bc48b.png" alt="">
        </template>
        <template v-slot:item-icon-active>
          <!-- <img src="https://qnhyd.laigl.com/dca4e1f092ca8c434ac809a992b84844.png" alt=""> -->
          <img src="../../../assets/images/shequ.png" alt="">
        </template>
        <template v-slot:item-text>
          <div>社区</div>
        </template>
     </tab-bar-item>

     <tab-bar-item path="/mine" activeColor="#6b0c03">
        <template v-slot:item-icon>
          <img src="https://qnhyd.laigl.com/6bb750867cd0d74591011742c3548ed3.png" alt="">
        </template>
        <template v-slot:item-icon-active>
          <img src="https://qnhyd.laigl.com/c40f1be69ea3cc8ebc5ff996d79175fc.png" alt="">
          
        </template>
        <template v-slot:item-text>
          <div>我的</div>
        </template>
     </tab-bar-item>
   </tab-bar>
   
   </div>
</template>

<script>
import TabBar from '../../commont/tabbar/TabBar.vue'
import TabBarItem from '../../commont/tabbar/TabBarItem.vue'
      export default {
        name:'MainTabBar',
        components:{
            TabBar,
            TabBarItem
        }
      }
</script>
<style scope>
tab-bar{
    position: absolute;
}
.plan-style{
     position: relative;
   bottom: 5.333vw;
}
.plan-style img{
    height: 10.667vw;
    width: 10.667vw;  
    vertical-align: middle;
}
.tab-bar-bgc{
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0; 
    z-index: 99;
}
.tab-bar-bgc img{
    width: 100vw;
    height: 18.667vw;
    vertical-align: middle;
}

</style>